<!DOCTYPE html>
<html lang="zh-CN">
	<head>
	 <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
	<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
	</script>
	 <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
	<meta charset="utf-8"/>
	<title>美站库 炫美网站大全</title>
	<link rel="stylesheet" type="text/css" href="images/index.css"/>
	</head>
	<body>
	<div id="header">
		<div id="top" class="auto">
			<div class="logo">
				<h1>
				<img src="images/logo.png" />
				<span>炫美网站大全</span>
				</h1>
			</div>
			<div class="serach">
				<form target="_blank" action="serach.html">
					<input id="searchText" class="text" type="text" />
					<input id="searchButton" class="submit" type="button" value="搜索" />
				</form>
			</div>
		</div>
		<div id="nav" class="auto">
			<ul>
				<li><a href="#">首页</a></li>
				<li><a href="#">提交站点</a></li>
			</ul>
		</div>
		<div id="runplay" class="auto">
			<div class="left">
				<a href="http://www.runoob.com/jquery/ajax-ajax.html"><img src="images/img1.jpg" /></a>
			</div>
			<div class="right">
				<dl>
					<dt id="runplayH">炫美网站，尽在美站库</dt>
					<dd class="txt" id="rate">本网站搜集互联网上各种炫美网站......</dd>
					<dd class="btn">
						<a href="#">查看更多</a>
					</dd>
				</dl>
			</div>
		</div>
	</div>
	<div id="main">
		<div id="main1">
			<div id="wrap">
				<div id="leftBody">
					<div class="leftDiv1">
						<h2>炫酷搜索</h2>
						<p>美站库是<a id="rsCount" href="http://www.sifangku.com" target="_blank">私房库</a>视频html课程中的第一个项目实战课! </p>
					</div>
					<div class="leftDiv2">
						<h2>炫美站点</h2>
						<ul>
							<li>
								<a href="https://movie.douban.com/subject/27622447/"><img src="images/222.jpg"  heigh="120px" /></a>
								<p>小偷家族</p>
							</li>
							<li>
								<a href="https://movie.douban.com/subject/26752088/"><img src="images/111.jpg"  heigh="120px" /></a>
								<p>我不是药神</p>
							</li>
							<li>
								<a href="https://movie.douban.com/subject/30167056/"><img src="images/333.jpg" /></a>
								<p>妖神记</p>
							</li>
							<li>
								<a href="https://movie.douban.com/subject/3541415/"><img src="images/444.jpg" /></a>
								<p>盗梦空间</p>
							</li>
							<li>
								<a href="https://movie.douban.com/subject/3168101/"><img src="images/555.jpg" /></a>
								<p>毒液:致命守护者</p>
							</li>
						</ul>
					</div>
					<div class="leftDiv3">
						<a href="#">查看更多</a>
					</div>
				</div>
				<div id="rightBody">
					<div class="rightDiv1">
						<h2>酷文</h2>
						<ul>
							<li>
								<h3><a href="#" target="blank">阅者感言</a></h3>
								<p>叶的离去，是风的追求，还是树的不挽留...</p>
							</li>
							<li>
								<h3><a href="#" target="blank">阅者感言</a></h3>
								<p>叶的离去，是风的追求，还是树的不挽留...</p>
							</li>
							<li>
								<h3><a href="#" target="blank">阅者感言</a></h3>
								<p>叶的离去，是风的追求，还是树的不挽留...</p>
							</li>
						</ul
					</div>
					<div class="rightDiv2">
						<dl class="dl1">
							<dt><a href="#">执笔写爱你</a></dt>
							<dd>执笔写爱你</dd>
						</dl>
						<dl class="dl2">
							<dt><a href="#">执笔写爱你</a></dt>
							<dd>执笔写爱你</dd>
						</dl>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="footer">
		<p class="p1">
			<a href="#" target="_blank">首页</a>
			<a href="#" target="_blank">美站</a>
			<a href="#" target="_blank">酷文</a>
			<a  class="last" href="#" target="_blank">联系我们</a>
		</p>
		<p>
			Copyright (c) 2014 | <a href="http://www.sifangku.com" target="_blank"> 私房库</a>
		</p>
	</div>
	<script>
	 $(document).ready(function(){
	 
		 var ajaxData = [
      
	  "复仇者联盟4",
	  "妖神记",
	  "武动乾坤",
	  "惊奇队长",
	  "盗梦空间",
    ];
			 var ajd = [
      
	  "复仇者联盟4",
	  "妖神记",
	  "武动乾坤",
	  "惊奇队长",
	  "盗梦空间",
    ];
	
	 $.ajax({url:"data/douban300.json",
			success:function(result){
				var i=0;
				ajd=result;
				for(i=0;i<result.subjects.length;i++)
					{
					var tt=result.subjects[i].title;
					ajaxData.push(tt);
					}
				alert();	
			}});
	
    $( "#searchText" ).autocomplete({
      source: ajaxData
    });
	 
	 
		$("#searchButton").click(function(){
		
			var usrIp=$("#searchText").val();
			$("#runplayH").html("您刚输入："+usrIp);
			alert(usrIp);
			
			$.ajax({url:"data/douban250.json",
			
			success:function(result){
				$("#rsCount").html("ajax访问成功");
				alert(result.subjects[3].title);
				
			//反查用户选择的电影名称，查评分rate,查影片封面cover
			
			var rate;
			var cover;
			for(i=0;i<ajd.subjects.length;i++)
				{
				var currentTitle=ajd.subjects[i].title;
					if(ajd.subjects[i].title==usrIp)
					{
					rate=ajd.subjects[i].rate;	
					cover=ajd.subjects[i].cover;
					$("#rate").html("电影评分为："+rate);
					
					//return;
					}
				}
			
			
			}});
		});
	
	});
	</script>
	</body>	
	
</html>